<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>波奇商城</title>
    <link rel="stylesheet" type="text/css" href="../font/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../css/base.css" />
    <link rel="stylesheet" type="text/css" href="../css/reset.css" />
    <link rel="stylesheet" type="text/css" href="../css/shop.css" />
</head>
<body>
    <div id="shop">
        <div id="top">
            <div class="container clearfix">
                <div class="top_l fl">
                    <ul>
                        <li class="fl shouc"><a href="#">
                            <i class="icon-search iconfont"></i>收藏波奇商城
                        </a>
                        </li>
                        <li class="fl city"><a href="#">广东</a>
                            <div class="bigCity">
                                <dl class="clearfix">
                                    <dt>华东地区:</dt>
                                    <dd>上海</dd>
                                    <dd>江苏</dd>
                                    <dd>浙江</dd>
                                    <dd>安徽</dd>
                                    <dd>山东</dd>
                                </dl>
                                <dl class="clearfix">
                                    <dt>华北东北:</dt>
                                    <dd>北京</dd>
                                    <dd>天津</dd>
                                    <dd>河北</dd>
                                    <dd>山西</dd>
                                    <dd>内蒙古</dd>
                                    <dd>辽宁</dd>
                                    <dd>济宁</dd>
                                    <dd>黑龙江</dd>
                                </dl>
                                <dl class="clearfix">
                                    <dt>华南东南:</dt>
                                    <dd>广东</dd>
                                    <dd>广西</dd>
                                    <dd>海南</dd>
                                    <dd>福建</dd>
                                    <dd>四川</dd>
                                    <dd>重庆</dd>
                                    <dd>贵州</dd>
                                    <dd>云南</dd>
                                    <dd>西藏</dd>
                                </dl>
                                <dl class="clearfix last">
                                    <dt>华中西北:</dt>
                                    <dd>湖北</dd>
                                    <dd>湖南</dd>
                                    <dd>江西</dd>
                                    <dd>河南</dd>
                                    <dd>陕西</dd>
                                    <dd>甘肃</dd>
                                    <dd>青海</dd>
                                    <dd>宁夏</dd>
                                    <dd>新疆</dd>
                                </dl>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="top_r fr">
                    <ul class="clearfix">
                        <li class="fl login"><a href="login.html">登录</a></li>
                        <li class="fl login"><a href="register.html">注册</a></li>
                        <li class="fl"><a href="#">手机版</a></li>
                        <li class="fl"><a href="#">关注波奇</a></li>
                        <li class="fl boqi"><i class="icon-liebiao iconfont"></i><a href="#">波奇首页</a>
                            <div class="menu">
                                <a href="#">
                                    <i></i>
                                    波奇服务
                                </a>
                                <a href="#">
                                    <i></i>
                                    波奇论坛
                                </a>
                                <a href="#">
                                    <i></i>
                                    波奇百科
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div id="logo">
            <div class="container clearfix">
                <div class="logo_l fl">波奇网</div>
                <div class="logo_c fl clearfix">
                    <input type="text" placeholder="请输入关键字"/>
                    <button>搜索</button>
                    <p>
                        <span>热门搜索：</span>
                        <a href="#">进口狗粮</a>
                        <a href="#">进口猫粮</a>
                        <a href="#">猫厕所</a>
                        <a href="#">猫笼</a>
                        <a href="#">口腔护理</a>
                        <a href="#">美发毛肤</a>
                    </p>
                </div>
                <div class="logo_r fr"> 
                </div>
            </div>
        </div>
        <div id="nav">
            <div class="container clearfix">
                <div class="nav_l fl">
                    <a href="#">
                        全部商品分类
                        <i class="icon-liebiao iconfont"></i>
                    </a>
                    <div class="sort">
                        <div class="dog zoo">
                            <h3>
                                <i class="icon-3 iconfont"></i>
                                <a href="#">狗狗用品</a>
                                <span>&gt;</span>
                            </h3>
                            <div class="content">
                                <span>主粮</span>
                                <span>零食</span>
                                <span>医疗</span>
                                <span>保健</span>
                                <span>出行</span>
                                <span>日用</span>
                                <span>玩具</span>
                                <span>美容</span>
                            </div>
                            <div class="third">
                                1
                            </div>
                        </div>
                        <div class="cat zoo">
                            <h3>
                                <i class="icon-3 iconfont"></i>
                                <a href="#">猫猫用品</a>
                                <span>&gt;</span>
                            </h3>
                            <div class="content">
                                <span>主粮</span>
                                <span>零食</span>
                                <span>医疗</span>
                                <span>保健</span>
                                <span>出行</span>
                                <span>日用</span>
                                <span>玩具</span>
                                <span>美容</span>
                            </div>
                            <div class="third">
                                2
                            </div>
                        </div>
                        <div class="chongwu zoo">
                            <h3>
                                <i class="icon-3 iconfont"></i>
                                <a href="#">奇趣小宠</a>
                                <span>&gt;</span>
                            </h3>
                            <div class="content">
                                <span>主粮</span>
                                <span>零食</span>
                                <span>医疗</span>
                            </div>
                            <div class="third">
                                3
                            </div>
                        </div>
                        <div class="water zoo">
                            <h3>
                                <i class="icon-3 iconfont"></i>
                                <a href="#">水族市场</a>
                                <span>&gt;</span>
                            </h3>
                            <div class="content">
                                <span>主粮</span>
                                <span>零食</span>
                                <span>医疗</span>
                                <span>保健</span>
                                <span>出行</span>
                            </div>
                            <div class="third">
                                4
                            </div>
                        </div>
                        <div class="rim zoo">
                            <h3>
                                <i class="icon-3 iconfont"></i>
                                <a href="#">萌宠周边</a>
                                <span>&gt;</span>
                            </h3>
                            <div class="content">
                                <span>主粮</span>
                                <span>零食</span>
                                <span>医疗</span>
                            </div>
                            <div class="third">
                                5
                            </div>
                        </div>
                    </div>
                </div>
                <div class="nav_c fl">
                    <ul class="clearfix">
                        <li class="fl"><a href="#">首页</a></li>
                        <li class="fl"><a href="#">狗狗</a></li>
                        <li class="fl"><a href="#">猫猫</a></li>
                        <li class="fl"><a href="#">小宠</a></li>
                        <li class="fl"><a href="#">水族</a></li>
                        <li class="fl"><a href="#">全球购</a></li>
                        <li class="fl"><a href="#">创意生活</a></li>
                        <li class="fl"><a href="#">品牌馆</a></li>
                        <li class="fl"><a href="#">波奇服务</a></li>
                    </ul>
                </div>
                <div class="nav_r fr">
                    <div class="shopping">
                        <i class="icon-gouwuche- iconfont"></i>
                        <a href="#">购物车</a>
                        <span id="number"></span>
                    </div>
                    <div id="goods">
                        <h2>已加入购物车的商品</h2>
                        <div id="car"></div>
                        <div class="account">
                            <div class="price">
                                已选则<span class="sum"></span>商品
                                &nbsp;&nbsp;&nbsp;共计：
                                <span class="total"></span>
                            </div>
                            <div class="links"><a href="car.html">去购物车结算</a></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="search">
            <div class="container clearfix">
                <div class="search_l fl clearfix">
                    <div class="web fl">
                        <a href="#">首页</a>
                        <span>&gt;</span>
                        <a href="#">狗狗专区</a>
                        <span>&gt;</span>
                        <a href="#">狗狗主粮</a>
                    </div>
                    <div class="input fl">
                        <input type="text" name="username" />
                        <i class="icon-search iconfont"></i>
                    </div>
                </div>
                <div class="search_r fr">
                    <a href="#">清空已选条件</a>
                </div>
            </div>
        </div>
        <div id="dog">
            <div class="container clearfix">
                <div class="asider fl">
                    <div class="goodcate">
                        <h2><i class="icon-gou iconfont"></i>狗狗商品</h2>
                        <ul class="goodcate_c">
                            <li class="active">
                                <h3>狗狗主粮</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                </div>
                            </li>
                            <li>
                                <h3>狗狗零食</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                </div>
                            </li>
                            <li>
                                <h3>医疗护理</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                </div>
                            </li>
                            <li>
                                <h3>营养保健</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                </div>
                            </li>
                            <li>
                                <h3>生活日用</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                    <a href="#">处方粮</a>
                                </div>
                            </li>
                            <li>
                                <h3>出行装备</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                    <a href="#">处方粮</a>
                                </div>
                            </li>
                            <li>
                                <h3>狗狗美容</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                </div>
                            </li>
                            <li>
                                <h3>狗狗玩具</h3>
                                <div class="service">
                                    <a href="#">进口粮</a>
                                    <a href="#">国产粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                    <a href="#">动干粮</a>
                                    <a href="#">处方粮</a>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="main fr">
                   <!--  <div class="brand"></div> -->
                    <div class="sort clearfix">
                        <div class="sort_l fl">
                            排序：
                            <span class="rank active">综合排序</span>
                            <span class="rank">销量</span>
                            <span class="rank">单价</span>
                            <span class="rank">售价</span>
                            <span class="rank">评论</span>
                            <span class="sousuo">
                                <a href="#"><i></i>全球购</a>
                            </span>
                            <span class="sousuo">
                                <a href="#"><i></i>只显示有货</a>
                            </span>
                        </div>
                        <div class="sort_r fr clearfix">
                            <div class="sort_rl fl">
                                <span>共998件商品</span>
                                <i class="page">1</i>
                                <span>/</span>
                                <i class="total">25</i>
                            </div>
                            <div class="sort_rr fr">
                                <span class="reduce">&lt;</span>
                                <span class="add">&gt;</span>
                            </div>
                        </div>
                    </div>
                    <div id="goodslist">  
                    </div>
                    
                    <div class="pagination">
                        <span class="active">1</span>
                        <span>2</span>
                        <span>3</span>
                        <span>4</span>
                        <span>5</span>
                        <span>6</span>
                        <span>7</span>
                        <span>8</span>
                        <span>9</span>
                        <span>下一页&gt;</span>
                        <span>末页</span>
                    </div>
                </div>
            </div>
        </div>
        <div id="promise">
            <div class="container">
                <ul class="clearfix">
                    <li class="fl"><img src="../img/promise1.png" alt="" /></li>
                    <li class="fl"><img src="../img/promise2.png" alt="" /></li>
                    <li class="fl"><img src="../img/promise3.png" alt="" /></li>
                    <li class="fl"><img src="../img/promise4.png" alt="" /></li>
                    <li class="fl"><img src="../img/promise5.png" alt="" /></li>
                </ul>
            </div>
        </div>
        <div id="links">
            <div class="container clearfix">
                <dl class="fl">
                    <dt>新手上路</dt>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">购物流程</a></dd>
                </dl>
                <dl class="fl">
                    <dt>购买方式</dt>
                    <dd><a href="#">余额问题</a></dd>
                    <dd><a href="#">余额问题</a></dd>
                    <dd><a href="#">余额问题</a></dd>
                    <dd><a href="#">余额问题</a></dd>
                </dl>
                <dl class="fl">
                    <dt>配送方式</dt>
                    <dd><a href="#">收费标准</a></dd>
                    <dd><a href="#">收费标准</a></dd>
                    <dd><a href="#">收费标准</a></dd>
                </dl>
                <dl class="fl">
                    <dt>售后服务</dt>
                    <dd><a href="#">收费标准</a></dd>
                    <dd><a href="#">收费标准</a></dd>
                    <dd><a href="#">收费标准</a></dd>
                    <dd><a href="#">收费标准</a></dd>
                </dl>
                <dl class="fl">
                    <dt>常见问题</dt>
                    <dd><a href="#">注册登录</a></dd>
                    <dd><a href="#">注册登录</a></dd>
                    <dd><a href="#">注册登录</a></dd>
                </dl>
            </div>
        </div>
        <div id="footer">
            <div class="container">
                <div class="footer_c">
                    <p>
                        <a href="#">关于波奇</a>
                        <span>|</span>
                        <a href="#">友情链接</a>
                        <span>|</span>
                        <a href="#">诚聘英才</a>
                        <span>|</span>
                        <a href="#">联系我们</a>
                        <span>|</span>
                        <a href="#">网站地图</a>
                        <span>|</span>
                        <a href="#">意见反馈</a>
                        <span>|</span>
                        <a href="#">帮助中心</a>
                        <span>|</span>
                        客服热线：400-820-6098
                    </p>
                    <p>
                        <a href="#"><i></i>沪公网安备 31011502004955号</a>
                        <span>|</span>
                        <a href="#">沪ICP备13034501号-2</a>
                        <span>|</span>
                        增值电信业务经营许可证:
                        <a href="#">沪B2-20140120</a>
                    </p>
                    <p>Copyright © 2007-2018 Boqii.com All Rights Reserved 光橙（上海）信息科技有限公司 版权所有 
                    </p>
                    <p>公司地址：上海市浦东新区盛夏路399号亚芯科技园1号楼6楼</p>
                    <p>
                        <a href="#">
                            <img src="../img/foot1.png" alt="" />
                        </a>
                        <a href="#">
                            <img src="../img/foot2.png" alt="" />
                        </a>
                        <a href="#">
                            <img src="../img/foot3.png" alt="" />
                        </a>
                        <a href="#">
                            <img src="../img/foot4.png" alt="" />
                        </a>
                    </p>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="../js/common.js"></script>
    <script type="text/javascript" src="../js/jquery-3.2.1.js"></script>
    <script type="text/javascript" src="../js/shop.js"></script>
</body>
</html>